<html lang="en">
	<head>
		<meta charset="utf-8">
		<meta http-equiv="X-UA-Compatible" content="IE=edge">
		<meta name="viewport" content="initial-scale=1.0, user-scalable=no, width=device-width">
		<link rel="stylesheet" href="https://a.amap.com/jsapi_demos/static/demo-center/css/demo-center.css" />
		<title>冷链可视化平台</title>
		<!--弹框-->
		<meta name="viewport" content="width=device-width,initial-scale=1.0,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no" />
		<link rel="stylesheet" href="syalert/syalert.min.css" />
		<script src="syalert/syalert.min.js"></script>
		<link rel="stylesheet" href="css/animate.min.css" />
		
		<script type="text/javascript" src="./js/jquery-3.1.1.min.js"></script>
		<script type="text/javascript" src="./js/echarts.min.js"></script>
		<script type="text/javascript" src="./map/hebei.js"></script>
		<script type="text/javascript" src="./js/extendsMap.js"></script>

		<!--jquery-->
		<script type="text/javascript" src="js/jquery.js"></script>
		<script type="text/javascript" src="js/jquery.liMarquee.js"></script>
		<script type="text/javascript" src="js/jquery.cxselect.min.js"></script>
		<!--自定义js-->
		<script type="text/javascript" src="js/js.js"></script>
		<link href="css/style.css"  rel="stylesheet" type="text/css" media="all" />
		<!--<script src="js/echarts.min.js" charset="utf-8"></script>-->
		<!--自定义样式-->
		<link rel="stylesheet" href="css/comon0.css">
		<!--自定义css-->
		<style>
			/*天、月、季、年按钮*/
			.btn-time {
				background-color: darkblue;
				width: 40px;
				height: 25px;
				color: #FFFFFF;
			}			
		</style>
	</head>
	<body bgcolor="#0B1746">
     <div style="background:#000d4a url(images/bg.jpg) center top;">
        <div class="loading">
            <div class="loadbox"> <img src="images/loading.gif"> 页面加载中... </div>
        </div>
        <div class="back"></div>
        <div class="head">
            <div class="weather" ><span id="showTime"></span></div>
            <h1 >冷链设备温湿度大数据平台</h1>
			</div>
			<script>
				var t = null;
            t = setTimeout(time, 1000);/*開始运行*/
            function time() {
                clearTimeout(t);/*清除定时器*/
                dt = new Date();
                var y = dt.getFullYear();
                var mt = dt.getMonth() + 1;
                var day = dt.getDate();
                var h = dt.getHours();
                var m = dt.getMinutes();
                var s = dt.getSeconds();
                document.getElementById("showTime").innerHTML = y + "年" + mt + "月" + day + "日" + h + "时" + m + "分" + s + "秒";
                t = setTimeout(time, 1000); 
            }
        </script>
			<!--主要内容-->
			<div class="mainbox">
				<div style="width:100%;height:35px">						
							<div class="bnt">
							<span class="topbnt_left fl" >
				
				<ul><li ><select  style="background-color:transparent ; border: 0;color:#FFFFFF;height:35px;width:87px;" id="mySelect1" onchange="suolengku(this.value)">
										<option value="0">冷库选择</option>
										</select>
									</li>
      								<li ><button  style="background-color:transparent ; border: 0;color:#FFFFFF;height:35px;width:87px;" id="diwenk"  onclick="diwenbutt()" >低温库</button></li>
     						 		<li ><button style="background-color:transparent ; border: 0;color:#FFFFFF;height:35px;width:87px;" id="lengdongk" onclick="lengdongbutt()">冷冻库</button></li>					 								
								</ul>
							</div>
							<span class=" fr topbnt_right ">
								<ul><li><a href="map.html">轨   迹</a></li>		   						 
   						 			<li><select style="background-color:transparent ; border: 0;color:#FFFFFF;height:35px;width:87px;"  id="mySelect4" onchange="suolengdong(this.value)"><option value="volvo">冷冻设备</option>
										</select>
   						 			</li>    						 	      						 	
   						 			<li><select style="background-color:transparent ; border: 0;color:#FFFFFF;height:35px;width:87px;"  id="mySelect3" onchange="suodiwen(this.value)"><option value="volvo">低温设备</option>
										</select>
   						 			</li>
						 			<li><select style="background-color:transparent ; border: 0;color:#FFFFFF;height:35px;width:87px;"  id="mySelect2" onchange="suolengl(this.value)"><option value="volvo">冷链选择</option>
										</select>
   						 			</li>  												
								</ul>
							</span>					
							</div>						
			<!--左-->	
				<ul class="clearfix">
								
     <li style="height: 600px;" >
                    <div class="boxall" >
                        <div class="alltitle">企业名称</div>
                        <div class="navboxall" style="height:100%;width:100%;overflow:auto;background-color:transparent;">
                            <table class="table1" width="100%" border="0" cellspacing="0" cellpadding="0">
                                <tbody>
										<tr>
											<td style="cursor:pointer;" ><a href="map.html"><img href="map.html" src="img/ditu.jpg" id="img1" width="24px" height="24px" style=" float:left;cursor:hand;"/><a hover{cursor:pointer}	title="公司" id="link1" style="color:#FFFFFF;"></a></a></td>
										</tr>
										<tr>
											<td style="cursor:pointer;"><a href="map.html"><img src="img/ditu.jpg" width="24px" height="24px" style=" float:left"/><a title="公司" id="link2" style="color:#FFFFFF;"> </a></a></td>
										</tr>
										<tr>
											<td style="cursor:pointer;"><a href="map.html"><img src="img/ditu.jpg" width="24px" height="24px" style=" float:left"/><a title="公司" id="link3" style="color:#FFFFFF;"> </a></a></td>
										</tr>
										<tr>
											<td style="cursor:pointer;"><a href="map.html"><img src="img/ditu.jpg" width="24px" height="24px" style=" float:left"/><a title="公司" id="link4" style="color:#FFFFFF;"> </a></a></td>
										</tr>
										<tr>
											<td style="cursor:pointer;"><a href="map.html"><img src="img/ditu.jpg" width="24px" height="24px" style=" float:left"/><a title="公司" id="link5" style="color:#FFFFFF;"> </a></td>
										</tr>
										<tr>
											<td style="cursor:pointer;"><a href="map.html"><img src="img/ditu.jpg" width="24px" height="24px" style=" float:left"/><a title="公司" id="link6" style="color:#FFFFFF;"> </a></a></td>
										</tr>
										<tr>
											<td style="cursor:pointer;"><a href="map.html"><img src="img/ditu.jpg" width="24px" height="24px" style=" float:left"/><a title="公司" id="link7" style="color:#FFFFFF;"> </a></a></td>
										</tr>
										<tr>
											<td style="cursor:pointer;"><a href="map.html"><img src="img/ditu.jpg" width="24px" height="24px" style=" float:left"/><a title="公司" id="link8" style="color:#FFFFFF;"> </a></a></td>
										</tr>
										<tr>
											<td style="cursor:pointer;"><a href="map.html"><img src="img/ditu.jpg" width="24px" height="24px" style=" float:left"/><a title="公司" id="link9" style="color:#FFFFFF;"> </a></a></td>
										</tr>
										<tr>
											<td style="cursor:pointer;"><a href="map.html"><img src="img/ditu.jpg" width="24px" height="24px" style=" float:left"/><a title="公司" id="link10" style="color:#FFFFFF;"> </a></a></td>
										</tr>
										<tr>
											<td style="cursor:pointer;"><a href="map.html"><img src="img/ditu.jpg" width="24px" height="24px" style=" float:left"/><a title="公司" id="link11" style="color:#FFFFFF;"> </a></a></td>
										</tr>
										<tr>
											<td style="cursor:pointer;"><a href="map.html"><img src="img/ditu.jpg" width="24px" height="24px" style=" float:left"/><a title="公司" id="link12" style="color:#FFFFFF;"> </a></a></td>
										</tr>
										<tr>
											<td style="cursor:pointer;"><a href="map.html"><img src="img/ditu.jpg" width="24px" height="24px" style=" float:left"/><a title="公司" id="link13" style="color:#FFFFFF;"> </a></a></td>
										</tr>
										<tr>
											<td style="cursor:pointer;"><a href="map.html"><img src="img/ditu.jpg" width="24px" height="24px" style=" float:left"/><a title="公司" id="link14" style="color:#FFFFFF;"> </a></a></td>
										</tr>
										<tr>
											<td style="cursor:pointer;"><a href="map.html"><img src="img/ditu.jpg" width="24px" height="24px" style=" float:left"/><a title="公司" id="link15" style="color:#FFFFFF;"> </a></a></td>
										</tr>
										<tr>
											<td style="cursor:pointer;"><a href="map.html"><img src="img/ditu.jpg" width="24px" height="24px" style=" float:left"/><a title="公司" id="link16" style="color:#FFFFFF;"> </a></a></td>
										</tr>
										<tr>
											<td style="cursor:pointer;"><a href="map.html"><img src="img/ditu.jpg" width="24px" height="24px" style=" float:left"/><a title="公司" id="link17" style="color:#FFFFFF;"> </a></a></td>
										</tr>
										<tr>
											<td style="cursor:pointer;"><a href="map.html"><img src="img/ditu.jpg" width="24px" height="24px" style=" float:left"/><a title="公司" id="link18" style="color:#FFFFFF;"> </a></a></td>
										</tr>
										<tr>
											<td style="cursor:pointer;"><a href="map.html"><img src="img/ditu.jpg" width="24px" height="24px" style=" float:left"/><a title="公司" id="link19" style="color:#FFFFFF;"> </a></a></td>
										</tr>
											
                                </tbody>
                            </table>
                        </div>
                    </div>
					<!--中-->
    <li >

                    <div class="boxall" style="height:320px">
					<div style="height:50px;>
						<p align="center">
							<div class="bnt">
  					<span class="topbnt_left fl">
   						<ul><li  style="height:42;px;width:77px;"><button style="background-color:transparent; border: 0;color:#FFFFFF;height:42px;width:77px;" id="day" onclick="tians()" >按 天</button></li>
      					<li style="height:42px;width:77px;"><button style="background-color:transparent ; border: 0;color:#FFFFFF;height:42px;width:77px;" id="month" onclick="yues()" >按 月</button></li>
     						 <li  style="height:42px;width:77px;" ><button style="background-color:transparent ; border: 0;color:#FFFFFF;height:42px;width:77px;" id="jidu" onclick="jis()" >按季度</button></li>
      					<li style="height:42px;width:77px;"><button style="background-color:transparent ; border: 0;color:#FFFFFF;height:42px;width:77px;" id="year" onclick="nians()" >按  年</button></li>  						 
							 </ul>
 						</div>
 						 <span class=" fr topbnt_right">
   						 <ul><li style="height:40px;width:82px;"><button style="background-color:transparent ; ; border: 0;color:#FFFFFF;height:40px;width:82px;" onclick="shishijiankong()" >实时监控</button></li>
      			 		<li style="height:40px;width:82px;"><button style="background-color:transparent ; border: 0;color:#FFFFFF;height:40px;width:82px;" onclick="lishibaojing()" >历史报警</button></li>
   					 </ul>
						</span>
						</p>
					</div>						
						
						
                        <div class="alltitle">温度</div>
                        <div class="navboxall" id="meter1" style="height:200px"></div>

                    </div>


                    <div class="boxall" style="height:300px">
                        <div class="alltitle">湿度</div>
                        <div class="navboxall" id="meter2" style="height:200px"></div>
              
                    </div>
                </li>

                
           </li>               
           </ul>

        </div>
    </div>
	<!-- 消息弹窗 -->
	<div class="sy-alert sy-alert-alert animated" sy-enter="zoomIn" sy-leave="zoomOut" sy-type="alert" sy-mask="true" id="alert2">
	  <div class="sy-title"></div>
	  <div class="sy-content">
	  <li>
	      <p id="p2"></p>
	      <p id="p3"></p>
		  <p id="p4"></p>
	      <p id="p5"></p>
		  <p id="p6"></p>
		  <p id="p7"></p>
		  <p id="p8"></p>
		  <p id="p9"></p>
		  <p id="p10"></p>
		  <p id="p11"></p>
	  </li>
	  </div>
	  <div class="sy-btn">
	    <button onClick="ok('alert2')">确定</button>
	  </div>
	</div>
	<script>
	function ok(id){
		syalert.syhide(id);	
	}
	</script>

     <script>
     huoqushuju()    //显示所有的公司，由于没有HTML的滚动，空间有限最多显示五个公司
     getData(a,b,c,d);
     $("#link1").click(function(){   //下面为五个公司对应的库房显示，点击哪个公司，显示该公司的库房
     var qiyename='title';
     //huoqukufang(qiyename)
     tianchongkf();
     tianchongll();
     });
     $("#link2").click(function(){
     var qiyename='title';
     huoqukufang(qiyename)
     });
     $("#link3").click(function(){
     var qiyename='title';
     huoqukufang(qiyename)
     });
     $("#link4").click(function(){
     var qiyename='title';
     huoqukufang(qiyename)
     });
     $("#link5").click(function(){
     var qiyename='title';
     huoqukufang(qiyename)
     });
     </script>	
     
     <script>
     	//获取DOM元素生成echarts对象
     	var meter1Chart = echarts.init(document.getElementById("meter1"));
     	var meter2Chart = echarts.init(document.getElementById("meter2"));
     	//初始化配置
     	meter1Chart.setOption(option1);
     	meter2Chart.setOption(option2);
     	//仪表
     	var meter1 = "温度";
     	var meter2 = "湿度";
     	//显示加载动画效果
     	meter1Chart.showLoading();
     	meter2Chart.showLoading();
     	//获取数据
     var dataDay = getData(a, b, c, d);
     setData1(dataDay, meter1Chart,kufangname);
     setData2(dataDay, meter2Chart,kufangname);
	 window.setInterval(function () {
	 tankuang();	
	 }, 1000);
	 
	 window.setInterval(function () {
	 shuaxin();
	 }, 1000000);
	 
	 $("#img1").click(function(){
	 	location.href='index1.html';
	 })
	 </script>
	</body>
</html>
